import React, {useState, useEffect} from 'react';

export default function UserProfile({ userId }) {
  const [user, setUser] = useState({
    id: null,
    name: '',
    phone: ''
  })

  useEffect(() => {
    async function fetchUser() {
      const resp = await fetch(`https://jsonplaceholder.typicode.com/users/${userId}`)
      const resJson = resp.json()
      setUser(resJson)
    }
    const timer = setTimeout(async () => {
      await fetchUser()
    }, 2000)
    document.title = 'USER'
  return () => { clearTimeout(timer)}
  }, [userId])

  return <div style={{ marginTop: 20 }}> <div>学员姓名: {user.name}</div><div> 联系方式: {user.phone}</div></div>
}
